import React, {Component} from 'react';
import './index.less';
import {base, high} from 'nc-lightapp-front';
import Header from "../components/Header";
import SortModal from "../components/SortModal";
import toggleModal from "./functions/toggleModalVisible";
import SearchModal from "../components/SearchModal";
import getMainTableData from "./functions/getMainTableData";
import MainTable from "../components/MainTable";
import getSortInitData from "./functions/getSortInitData";
import getTableHeaderData from "./functions/getTableHeaderData";
import updateButtonStatus from "./functions/updateButtonStatus";
import clearMainTableData from "./functions/clearMainTableData";
//import viewCard from './functions/viewCard';
import {getAppPageConfig, handleHash} from "src/hrpub/common/utils/utils";
import getSysConf from "./functions/getSysConf";
import ViewCard from 'src/hrpub/common/components/card-view';
import WpsModal from 'src/hrpub/common/components/wpsPreModel';

@handleHash('20198162232323', '/ifr?page=20198162232323&c=60073020&p=60073020p&ar=0001Z700APPN60073020')

class RosterMgt extends Component {
    constructor(props) {
        super(props);
        if (props.use) {
            props.use.table('rosterTable');
            props.use.search('query');
        }
        this.config = getAppPageConfig();
        this.state = {
            orgVal: {},
            json: {},
            queryOid: '',
            rosterRefVal: {},
            sortModalVisible: false,
            rosterColumns: [],
            rosterData: [],
            pageInfo: {
                pageSize: 10,
                pageIndex: 1,
                total: 0,
                totalPage: 1
            },
            hasSearched: false,
            searchModalValue: {},
            sort_field: [],
            allSortField: [],
            selectedRowIndex: ''
        };
        props.createUIDom(this.config, (data) => {
            this.setState({
                buttons: data.button || [],
                context: data.context || {},
                queryOid: data.template.query.oid
            });

            props.meta.setMeta(data && data.template ? data.template : {});
            props.button.setButtons(data && data.button ? data.button : {});
        });
        props.MultiInit.getMultiLang({
            moduleId: 'hi6007', domainName: 'hrhi', callback: (json, status, inlt) => {
                if (status) {
                    this.setState({json, inlt})//存json和inlt到页面state中并刷新页面
                }
            }
        });
        this.updateOrgValue = this.updateOrgValue.bind(this);
        this.updateRefValue = this.updateRefValue.bind(this);
        this.sortModalOnSure = this.sortModalOnSure.bind(this);
        this.toggleModal = this.toggleModal.bind(this);
        this.updateState = this.updateState.bind(this);
        this.getMainTableData = this.getMainTableData.bind(this);
        this.viewCard = this.viewCard.bind(this);
        this.getSysConf = this.getSysConf.bind(this);
        updateButtonStatus.call(this);
    }

    componentDidMount() {
        if (window.location.href.match('localhost:3006')) window.location.hash = `#/ifr?page=20198162232323`;
    }

    updateState(data, callback = () => {
    }) {
        this.setState(data, callback)
    }

    updateOrgValue(data) {
        this.setState(data, async () => {
            await this.getSysConf(data.orgVal);
            if (!data.orgVal.refpk && this.state.hasSearched) {
                clearMainTableData.call(this);
            } else {
                if (this.state.rosterRefVal.refpk) {
                    getSortInitData.call(this, () => {
                        getTableHeaderData.call(this);
                    });
                }
            }
        })
    }

    getSysConf = (orgValue) => {
        return getSysConf.call(this, orgValue);
    };

    updateRefValue(data) {
        this.setState(data, () => {
            if (!data.rosterRefVal.refpk && this.state.hasSearched) {
                clearMainTableData.call(this);
            } else {
                if (this.state.orgVal.refpk) {
                    getSortInitData.call(this, () => {
                        getTableHeaderData.call(this);
                    });
                }
            }
        })
    }

    getMainTableData() {
        getMainTableData.call(this);
    }

    // 排序弹窗点击确定的回调
    sortModalOnSure(value) {
        const {pageInfo, hasSearched} = this.state;
        this.setState({
            sort_field: value,
            pageInfo: {
                ...pageInfo,
                pageIndex: 1
            }
        }, () => {
            if (hasSearched) {
                this.getMainTableData();
            }
        });

    }

    // 切换各种弹窗显示隐藏，type为弹窗的显示隐藏state的key值
    toggleModal(type, visible) {
        return toggleModal.call(this, type, visible);
    }

    viewCard() {
        this.wpsview.openView(this.props.table.getCheckedRows('rosterTable'));
        // this.wpsview.openView(this.props.table.getCheckedRows('rosterTable'))
    }

    render() {
        const {
            orgVal, queryOid, rosterRefVal, sortModalVisible, pageInfo, hasSearched, searchModalValue,
            rosterData, rosterColumns, allSortField, sort_field, json, selectedRowIndex
        } = this.state;
        const {table, meta} = this.props;
        return (
            <div className='roster-mgt nc-bill-card'>
                <Header {...this.props}
                        json={json}
                        orgVal={orgVal}
                        rosterRefVal={rosterRefVal}
                        updateState={this.updateState}
                        updateOrgValue={this.updateOrgValue}
                        updateRefValue={this.updateRefValue}
                        viewCard={this.viewCard}
                        hasSearched={hasSearched}
                        pageInfo={pageInfo}
                        getMainTableData={this.getMainTableData}
                        queryOid={queryOid}
                        searchModalValue={searchModalValue}
                        sort_field={sort_field}
                />
                <MainTable
                    {...this.props}
                    json={json}
                    orgVal={orgVal}
                    updateState={this.updateState}
                    getMainTableData={this.getMainTableData}
                    rosterColumns={rosterColumns}
                    rosterData={rosterData}
                    pageInfo={pageInfo}
                    selectedRowIndex={selectedRowIndex}
                />
                <SearchModal
                    {...this.props}
                    json={json}
                    pageInfo={pageInfo}
                    queryOid={queryOid}
                    updateState={this.updateState}
                    getMainTableData={this.getMainTableData}
                />
                <SortModal
                    table={table}
                    meta={meta}
                    json={json}
                    allSortField={allSortField}
                    sort_field={sort_field}
                    visible={sortModalVisible}
                    onSure={this.sortModalOnSure}
                    onClose={this.toggleModal('sortModalVisible', false)}
                />
                {/* <ViewCard
                    {...this.props}
                    onRef={
                        node => this.viewCardNode = node
                    }
                /> */}
                <WpsModal
                    {...this.props}
                    onRef={ref => this.wpsview = ref}
                    appcode={this.config.appcode}
                    pk_org={orgVal}

                />
            </div>
        );
    }
}

export default RosterMgt;
